<style>
    .layui-form-label{
        width: 90px;
    }
    .layui-input-block {
        margin-left: 120px;
    }
</style>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <!-- 头部操作栏 -->
            <div class="layui-form lay-header">
                <div class="toolbar">
                    <div class="layui-form-item lay-query-content">
                        <div class="lay-query-box">
                            <div class="query-lt">
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">询价单号：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="inquiryNo" class="layui-input" type="text" placeholder="输入询价单号"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">请购单号：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="receiptsNo" class="layui-input" type="text" placeholder="输入所属请购单号"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">询价状态：</label>
                                    <div class="layui-input-inline mr0">
                                        <select name="enquiryStatus">
                                            <option value="">请选择询价状态</option>
                                            <option value="inquiry">询价中</option>
                                            <option value="finish">询价结束</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">是否公开：</label>
                                    <div class="layui-input-inline mr0">
                                        <select name="hasPublic">
                                            <option value="">是否公开</option>
                                            <option value="0">否</option>
                                            <option value="1">是</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">联系人：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="contactPerson" class="layui-input search-input" type="text" placeholder="输入联系人"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">联系人电话：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="contactNumber" class="layui-input search-input" maxlength="11" type="text" placeholder="输入联系人电话"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">时间段：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="createTime" id="pTime" class="layui-input date-icon" type="text"
                                               placeholder="选择时间" style="width: 200px" readonly/>
                                    </div>
                                    <input name="startCreateTime" id="sTime" type="hidden"/>
                                    <input name="endCreateTime" id="eTime" type="hidden"/>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">交货开始时间：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="deliveryStartTime" id="deliveryStartTime" readonly class="layui-input" type="text" placeholder="输入交货开始时间"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label w-auto">交货截止时间：</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="deliveryTime" id="deliveryTime" readonly class="layui-input" type="text" placeholder="输入交货截止时间"/>
                                    </div>
                                </div>
                            </div>
                            <div class="query-rt">
                                <div class="layui-inline">
                                    <button class="layui-btn icon-btn color-green" lay-filter="formSubSearchLog" lay-submit layui-form-keyDownSearch="true">查询</button>
                                    <button class="layui-btn icon-btn color-white" lay-filter="resets" lay-submit>重置</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--<div class="lay-btn-rows">
                    <div class="lay-btn-box">
                        <div class="lay-btn-lt">
                            <button id="purchaseEnquiryBtnAdd" class="layui-btn icon-btn color-reseda">添加</button>
                        </div>
                        <div class="lay-btn-rt">

                        </div>
                    </div>
                </div>-->
            </div>


            <!-- 表格 -->
            <table class="layui-table" id="erpPurchaseEnquiry-table" lay-filter="erpPurchaseEnquiry-table"></table>
        </div>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="erpPurchaseEnquiry-table-bar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="view">详情</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn layui-btn-xs" lay-event="quotation">报价单</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


<!-- erpPurchaseRequisitions表单弹窗 -->
<script type="text/html" id="erpPurchaseEnquiry-form">
    <form lay-filter="erpPurchaseEnquiry-form" class="layui-form open-form">
        <div class="open-model">
            <div class="open-auto">
                <input name="id" type="hidden"/>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">询价结束时间<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="inquiryEndTime" id="inquiryEndTime" placeholder="请选择询价结束时间" type="text" class="layui-input" lay-verify="required" required />
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">交货开始时间<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="deliveryStartTime" id="deliveryStartTimeForm" placeholder="请选择交货开始时间" type="text" class="layui-input" lay-verify="required" required />
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">交货截止时间<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="deliveryTime" id="deliveryTimeForm" placeholder="请选择交货时间" type="text" class="layui-input" lay-verify="required" required />
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">联系人<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="contactPerson" placeholder="请输入联系人" type="text" class="layui-input" lay-verify="required" required />
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">联系人电话<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="contactNumber" placeholder="请输入联系人电话" type="text" class="layui-input" lay-verify="required" required />
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">状态<span style="color:red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="enquiryStatusDesc" type="text" class="layui-input" disabled />
                        </div>
                    </div>
                </div>

                <table class="layui-table" id="erpPurchaseEnquiry-add-table" lay-filter="erpPurchaseEnquiry-add-table"></table>
            </div>
            <div class="layui-form-item text-right">
                <button class="layui-btn layui-btn-primary" ew-event="closeDialog" type="button">取消</button>
                <button class="layui-btn" lay-filter="erpPurchaseEnquiry-form-submit" lay-submit>保存</button>
            </div>
        </div>
    </form>
</script>

<script type="text/html" id="erpPurchaseEnquiryListAdd">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-form toolbar">
                <input id="enquiryAdd-supplierName" class="layui-input search-input" type="text" placeholder="输入供应商名称"/>&emsp;
                <input id="enquiryAdd-legalPerson" class="layui-input search-input" type="text" placeholder="输入法人名称"/>&emsp;
                <input id="enquiryAdd-legalPersonPhone" class="layui-input search-input" type="text" placeholder="输入法人电话"/>&emsp;
                <button id="enquiryAdd-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
                <button id="enquiryAdd-btn-choose" class="layui-btn layui-btn-normal">确认选择</button>
            </div>
            <table class="layui-table" id="enquirySupplierAdd-table" lay-filter="enquirySupplierAdd-table"></table>
        </div>
    </div>
</script>

<!--期望含税价格-->
<script type="text/html" id="price">
    {{# var price = "";
    if(d.price != null){
    price = d.price;
    }
    }}
    <div><input name="price" placeholder="请输入" type="text" value="{{price}}" lay-verify="required|quantity" required class="layui-input" maxlength="10" style="border: 0;height: 28px;text-align:center;" /></div>
</script>

<!--需求数量-->
<script type="text/html" id="quantity">
    {{# var quantity = "";
    if(d.quantity != null){
    quantity = d.quantity;
    }
    }}
    <div><input name="quantity" placeholder="请输入" type="text" value="{{quantity}}" lay-verify="required|quantity" required class="layui-input" maxlength="10" style="border: 0;height: 28px;text-align:center;" /></div>
</script>


<!-- erpPurchaseEnquiry表单弹窗 -->
<script type="text/html" id="erpPurchaseEnquiry-view">
    <form id="erpPurchaseEnquiry-view" lay-filter="erpPurchaseEnquiry-view" class="layui-form model-form">
        <input name="id" type="hidden"/>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">询价结束时间</label>
                <div class="layui-input-block">
                    <input name="inquiryEndTime" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">交货开始时间</label>
                <div class="layui-input-block">
                    <input name="deliveryStartTime" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">交货截止时间</label>
                <div class="layui-input-block">
                    <input name="deliveryTime" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">联系人</label>
                <div class="layui-input-block">
                    <input name="contactPerson" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">联系人电话</label>
                <div class="layui-input-block">
                    <input name="contactNumber" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">状态</label>
                <div class="layui-input-block">
                    <input name="enquiryStatusDesc" type="text" class="layui-input" disabled />
                </div>
            </div>
        </div>

        <div style="margin-left: 30px;">
            <table class="layui-table" id="erpPurchaseEnquiry-add-table" lay-filter="erpPurchaseEnquiry-add-table"></table>
        </div>

    </form>
</script>

<script type="text/html" id="erpPurchaseEnquiry-quotationList">
    <div class="open-form">
        <div class="open-model">
            <div class="open-auto">
                <!-- 头部操作栏 -->
                <div class="layui-form toolbar">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <div class="layui-form-label w-auto">报价单号：</div>
                            <div class="layui-input-inline mr0">
                                <input name="quotationNo" class="layui-input" type="text" placeholder="输入报价单号"/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <div class="layui-form-label w-auto">供应商：</div>
                            <div class="layui-input-inline mr0">
                                <select name="supplierId" lay-search></select>
                            </div>
                        </div>
                        <!--<div class="layui-inline">
                            <div class="layui-input-inline mr0">
                                <select id="status">
                                    <option value="">请选择状态</option>
                                    <option value="1">待审核</option>
                                    <option value="2">审核成功</option>
                                    <option value="3">审核失败</option>
                                </select>
                            </div>
                        </div>-->
                        <div class="layui-inline">
                            <button class="layui-btn icon-btn" lay-filter="quotationFormSubSearchLog" lay-submit><i class="layui-icon">&#xe615;</i>搜索</button>
                            <!--<button id="erpPurchaseEnquiryBtnAdd" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>添加</button>
                            <button id="erpPurchaseEnquiryBtnExport" class="layui-btn icon-btn"><i class="layui-icon">&#xe67d;</i>导出</button>-->
                        </div>
                    </div>
                </div>
                <!-- 表格 -->
                <table class="layui-table" id="purchaseEnquiryErpPurchaseQuotation-table" lay-filter="purchaseEnquiryErpPurchaseQuotation-table"></table>
            </div>
            <div class="layui-form-item text-right">
                <button class="layui-btn layui-btn-primary" ew-event="closeDialog" type="button">取消</button>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="purchaseEnquiryErpPurchaseQuotationSupplierId_list">
    <option value="">请选择供应商</option>
    {{# layui.each(d, function(index, item){ }}
    <option value="{{item.id}}">{{item.corporateName}}</option>
    {{# }) }}
</script>

<!-- js部分 -->
<script>
    layui.use(['layer', 'form', 'table', 'admin','laytpl','laydate','util','formSelects'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var admin = layui.admin;
        var upload = layui.upload;
        var laytpl = layui.laytpl;
        var laydate = layui.laydate;
        var util = layui.util;
        var formSelects = layui.formSelects;

        form.render("select");

        //时间范围
        laydate.render({
            elem: '#pTime',
            type: 'date',
            range: true,
            done: function (value, date, endDate) {
                if(value){
                    var dateValue = value.split(" - ");
                    $("#sTime").val(dateValue[0]+" 00:00:00");
                    $("#eTime").val(dateValue[1]+" 23:59:59");
                }else {
                    $("#sTime").val("");
                    $("#eTime").val("");
                }
            }
        });

        laydate.render({
            elem: '#deliveryStartTime'
        });
        laydate.render({
            elem: '#deliveryTime',
            type: 'datetime',
        });

        // 渲染表格
        var insTb = table.render({
            elem: '#erpPurchaseEnquiry-table',
            url: config.base + 'enterprise/purchase/admin/purchaseEnquiry/list',
            page: true,
            cellMinWidth: 100,
            cols: [[
                {type: 'numbers', title: '序号', fixed: 'left'},
                {field: 'inquiryNo', align: 'center', title: '询价单号', width: 150},
                {field: 'receiptsNo', align: 'center', title: '所属请购单号', width: 150},
                {field: 'productNumber', align: 'center', title: '物料数量', width: 100},
                {field: 'productNames', align: 'center', title: '物料名称', width: 140},
                {align: 'center', title: '是否公开',templet:function(d){
                        return d.hasPublic ? "是":"否";
                    }, width: 100},
                {field: 'enquiryStatusDesc', align: 'center', title: '询价状态', width: 100},
                {field: 'inquiryEndTime', align: 'center', title: '询价结束时间', width: 170},
                {field: 'deliveryStartTime', align: 'center', title: '交货开始时间', width: 170},
                {field: 'deliveryTime', align: 'center', title: '交货截止时间', width: 170},
                {field: 'contactPerson', align: 'center', title: '联系人', width: 120},
                {field: 'contactNumber', align: 'center', title: '联系人电话', width: 150},
                {field: 'createTime', align: 'center', title: '创建时间', width: 170},
                {align: 'center', toolbar: '#erpPurchaseEnquiry-table-bar', title: '操作',width: 250, fixed: 'right'}
            ]]
        });

        // 工具条点击事件
        table.on('tool(erpPurchaseEnquiry-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;
            if (layEvent === 'edit') { // 修改
                showEditModel(data);
            } else if (obj.event === 'del') { //删除
                doDelete(obj);
            } else if (obj.event === 'quotation') { //报价单
                quotation(data);
            } else if (obj.event === 'view') { //详情
                showViewModel(data);
            }
        });

        // 添加按钮点击事件
        $('#purchaseEnquiryBtnAdd').click(function () {
            showEditModel();
        });

        //显示表单弹窗
        var showEditModel = function (data, layEvent) {
            console.log(data);
            var title = data ? '更新询价单信息' : '新增询价单信息';
            admin.open({
                type: 1,
                area: ['1200px', '80%'],
                title: title,
                content: $("#erpPurchaseEnquiry-form").html(),
                success: function () {
                    var erpPurchaseEnquiryDetails = []; //询价单明细数据
                    if(data){
                        //询价结束时间
                        laydate.render({
                            elem: '#inquiryEndTime', //指定元素
                            type: 'datetime'
                        });

                        //交货开始时间
                        laydate.render({
                            elem: '#deliveryStartTimeForm', //指定元素
                            type: 'datetime'
                        });

                        //交货截止时间
                        laydate.render({
                            elem: '#deliveryTimeForm', //指定元素
                            type: 'datetime'
                        });

                        //获取询价单明细数据
                        admin.req('enterprise/purchase/admin/purchaseEnquiryDetail/list', {purchaseEnquiryId: data.id}, function (data) {
                            if (200 == data.code) {
                                erpPurchaseEnquiryDetails = data.data;
                                // 渲染表格
                                table.render({
                                    elem: '#erpPurchaseEnquiry-add-table',
                                    data: erpPurchaseEnquiryDetails,
                                    limit: erpPurchaseEnquiryDetails.length,
                                    cols: [[
                                        {type: 'numbers'},
                                         {field: 'skuCode', align: 'center', title: '物料编号'},
                                        {field: 'productName', align: 'center', title: '物料名称'},
                                        {field: 'specifications', align: 'center', title: '规格型号'},
                                        {field: 'unitName', align: 'center', title: '计量单位'},
                                    ]]
                                });
                            }else {
                                layer.msg('获取明细失败', {icon: 2, time: 1000});
                            }
                        }, 'GET');

                        form.val('erpPurchaseEnquiry-form', data);

                        // 表单提交事件
                        form.on('submit(erpPurchaseEnquiry-form-submit)', function (data) {
                            // layer.load(2);
                            console.log(data.field);
                            admin.req('enterprise/purchase/admin/purchaseEnquiry/update', data.field, function (data) {
                                layer.closeAll('loading');
                                if (data.code == 200) {
                                    layer.msg(data.msg, {icon: 1, time: 500});
                                    table.reload('erpPurchaseEnquiry-table', {});
                                    layer.closeAll('page');
                                } else {
                                    layer.msg(data.msg, {icon: 2, time: 1000});
                                }
                            }, 'PUT');
                            return false;
                        });

                    }
                }
            })
        };

        // 删除
        var doDelete = function (obj) {
            layer.confirm('确定要删除吗？', {
                offset: '65px',
                skin: 'layui-layer-admin'
            }, function (i) {
                layer.close(i);
                layer.load(2);
                admin.req('enterprise/purchase/admin/purchaseEnquiry/' + obj.data.id, {}, function (data) {
                    layer.closeAll('loading');
                    if (data.code == 200) {
                        layer.msg(data.msg, {icon: 1, time: 500});
                        obj.del();
                    } else {
                        layer.msg(data.msg, {icon: 2, time: 1000});
                    }
                }, 'DELETE');
            });
        };

        // 报价单
        var quotation = function (data) {
            admin.open({
                type: 1,
                area: ['1200px', '80%'],
                title: '询价单报价清单',
                content: $("#erpPurchaseEnquiry-quotationList").html(),
                success: function () {
                    // 获取供应商
                    admin.req('enterprise/purchase/admin/supplierInfoPass/list', {limit: 99999}, function (data) {
                        if (200 == data.code) {
                            laytpl(purchaseEnquiryErpPurchaseQuotationSupplierId_list.innerHTML).render(data.data, function (html) {
                                $("select[name='supplierId']").html(html);
                                form.render('select');
                            });
                        } else {
                            layer.msg('获取供应商失败', {icon: 2, time: 1000});
                        }
                    }, 'GET');

                    // 渲染表格
                    var quotationInsTb = table.render({
                        elem: '#purchaseEnquiryErpPurchaseQuotation-table',
                        url: config.base + 'enterprise/purchase/admin/purchaseQuotation/list',
                        method: 'GET',
                        where: {
                            purchaseEnquiryId: data.id
                        },
                        page: true,
                        cols: [[
                            {type: 'numbers'},
                            {field: 'quotationNo', align: 'center', title: '报价单号'},
                            {field: 'inquiryNo', align: 'center', title: '所属询价单号'},
                            {field: 'receiptsNo', align: 'center', title: '所属请购单号'},
                            {field: 'corporateName', align: 'center', title: '供应商'},
                            {field: 'quotedProductNumber', align: 'center', title: '报价物料数'},
                            {field: 'productNames', align: 'center', title: '物料名称'},
                            {field: 'assignNumber', align: 'center', title: '已分配物料数'},
                            {field: 'statusDesc', align: 'center', title: '状态'},
                            {field: 'createTime', align: 'center', title: '创建时间', width: 170}
                        ]]
                    });

                    // 搜索
                    form.on('submit(quotationFormSubSearchLog)', function (data) {
                        quotationInsTb.reload({where: data.field,page: {curr: 1}},'data');
                    });

                }
            })
        };

        //详情
        var showViewModel = function (data) {
            admin.open({
                type: 1,
                area: ['1200px', '80%'],
                title: '询价单报价清单',
                content: $("#erpPurchaseEnquiry-view").html(),
                success: function () {
                    form.val('erpPurchaseEnquiry-view', data);
                    var erpPurchaseEnquiryDetails = []; //询价单明细数据
                    //获取询价单明细数据
                    admin.req('enterprise/purchase/admin/purchaseEnquiryDetail/list', {purchaseEnquiryId: data.id}, function (data) {
                        if (200 == data.code) {
                            erpPurchaseEnquiryDetails = data.data;
                            // 渲染表格
                            table.render({
                                elem: '#erpPurchaseEnquiry-add-table',
                                data: erpPurchaseEnquiryDetails,
                                limit: erpPurchaseEnquiryDetails.length,
                                height: 450,
                                cols: [[
                                    {type: 'numbers'},
                                     {field: 'skuCode', align: 'center', title: '物料编号'},
                                    {field: 'productName', align: 'center', title: '物料名称'},
                                    {field: 'specifications', align: 'center', title: '规格型号'},
                                    {field: 'unitName', align: 'center', title: '计量单位'},
                                ]],
                                done: function () {
                                    $("input[name='price']").on("input", function(e){
                                        //获取input输入的值
                                        var curValue = e.delegateTarget.value;
                                        var curIndex = $(this).closest("tr").data("index");
                                        if(erpPurchaseEnquiryDetails[curIndex]){
                                            erpPurchaseEnquiryDetails[curIndex].price = curValue;
                                        }
                                    })
                                }
                            });
                        }else {
                            layer.msg('获取明细失败', {icon: 2, time: 1000});
                        }
                    }, 'GET');

                }
            })
        };

        // 搜索
        form.on('submit(formSubSearchLog)', function (data) {
            insTb.reload({where: data.field,page: {curr: 1}},'data');
        });

        // 重置搜索
        form.on('submit(resets)', function (data) {
            insTb.reload({where: admin.resetSearch(data.field), page: {curr: 1}}, 'data');
        });

        // 导出excel
        $('#erpPurchaseEnquiryBtnExport').click(function () {
            var checkRows = table.checkStatus('erpPurchaseEnquiry-table');
            if (checkRows.data.length == 0) {
                layer.msg('请选择要导出的数据', {icon: 2});
            } else {
                table.exportFile(insTb.config.id, checkRows.data, 'xls');
            }
        });

    });
</script>